<!--
功能：管理员学员信息,
作者：RanSheng,
邮箱：1534677527@qq.com",
时间：2021/6/1 12:14,
版本：v1.0,
修改记录：,
修改内容：,
修改人员：,
修改时间：,
-->
<template>
  <div>
    <div class="box-header">
      <div class="input">
        <el-input placeholder="请输入姓名" v-model="name" class="input-with-select" @keydown.enter.native="inputUserAll">
          <el-button slot="append" icon="el-icon-search" @click="inputUserAll"></el-button>
        </el-input>
      </div>
      <el-upload
        class="upload-file"
        :action="doUpload"
        :show-file-list="false"
        :before-upload="beforeUpload">
        <el-button  type="primary">用户导入</el-button>
      </el-upload>
      <a href="http://localhost:9999/boos/out" target="_self" class="a">用户导出</a>
      <el-button type="info" :disabled="dis" @click="reset">密码重置</el-button>
      <el-button type="warning" :disabled="dis">用户修改</el-button>
      <el-button type="danger" :disabled="dis" @click="removeUser">批量删除</el-button>
    </div>
    <div class="box-table">
      <el-table
        :data="tableData"
        stripe
        @selection-change="handleSelectionChange">
        <el-table-column
          type="selection"
          width="55">
        </el-table-column>
        <el-table-column
          v-for="t in column"
          :key="t.id"
          :prop="t.prop"
          :label="t.label"
        >
        </el-table-column>
      </el-table>
    </div>
    <div class="block">
      <el-pagination
        @current-change="handleCurrentChange"
        :current-page.sync="currentPage1"
        :page-size="pageSize"
        layout="total, prev, pager, next"
        :total="all">
      </el-pagination>
    </div>
  </div>
</template>

<script>
import {message,confirm} from "@/utils/age";

export default {
  name: "User",
  data() {
    return {
      doUpload: '#',
      fileList: [],
      dis:true,
      multipleSelection:[],
      name: '',
      all: 100,
      page: 1,
      pageSize: 8,
      currentPage1: 1,
      column: [{
        id: 1,
        prop: 'name',
        label: '姓名'
      }, {
        id: 2,
        prop: 'professional',
        label: '专业'
      }, {
        id: 3,
        prop: 'grade',
        label: '班级'
      }, {
        id: 4,
        prop: 'phone',
        label: '电话'
      }, {
        id: 5,
        prop: 'birth',
        label: '生日'
      }, {
        id: 6,
        prop: 'beds.name',
        label: '床位号'
      }, {
        id: 7,
        prop: 'room.name',
        label: '房间号'
      }, {
        id: 8,
        prop: 'floor.name',
        label: '楼层号'
      }, {
        id: 9,
        prop: 'card',
        label: '身份证号'
      }],
      tableData: [],
    };
  },
  components: {},
  computed: {},
  mounted() {
    //  查询管理的楼层中的所有的学员信息
    this.findAll()
  },
  methods: {
    beforeUpload(file) {
      let fd = new FormData();
      fd.append('file', file);//传文件
      this.$http.post('boos/in', fd).then(response => {
        message("success", "成功")
        this.findAll()
      }).catch(err => {
        message("error", "请求参数错误")
      })
    },
    //用户删除
    removeUser(){
      confirm("确定要删除所选学员？",this.removeOne)
    },
    removeOne(){
      this.$http.post('/root/del', this.multipleSelection).then(response => {
        if (response.data) {
          message("success", "删除成功")
        } else {
          message("error", "未知的错误")
        }
        this.findAll()
      }).catch(err => {
        this.findAll()
        message("error", "请求参数错误")
      })
    },
    //密码重置
    reset(){
      confirm("确定要重置选中用户的密码为【000000】？",this.resetAll)
    },
    resetAll(){
      this.$http.post('/root/reset', this.multipleSelection).then(response => {
        if (response.data) {
          message("success", "重置成功")
        } else {
          message("error", "未知的错误")
        }
      }).catch(err => {
        message("error", "请求参数错误")
      })
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
      if (this.multipleSelection.length>=1){
        this.dis=false
      }else {
        this.dis=true
      }
    },
    findAll() {
      this.$http.get('/root/user/' + this.page + '/' + this.pageSize).then(response => {
        if (response.data) {
          this.tableData = response.data.allList
          this.all = response.data.total
          message("success", "查询成功")
        } else {
          message("error", "未知的错误")
        }
      }).catch(err => {
        message("error", "请求参数错误")
      })
    },
    handleCurrentChange(val) {
      this.page = val
      this.findAll()
    },
    inputUserAll() {
      if (this.name.trim() != '') {
        let user = {
          name: this.name
        }
        this.$http.post('/root/input', user).then(response => {
          if (response.data) {
            this.tableData = response.data
            this.name = ''
            message("success", "查询成功")
          } else {
            message("error", "未知的错误")
          }
        }).catch(err => {
          message("error", "请求参数错误")
        })
      } else {
        this.findAll()
      }

    }
  },
  watch: {},
  destroyed() {

  },
}
</script>

<style scoped>

.a{
  text-decoration: none;
  display: block;
  height: 40px;
  line-height: 40px;
  width: 98px;
  text-align: center;
  border-radius: 5px;
  color: #ffffff;

  background-color: pink;
}

/*头部样式*/
.box-header {
  width: 100%;
  height: 50px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}

.input {
  width: 500px;
}

/**/
.box-table {
  width: 100%;
  min-height: 600px;
}

.block {
  margin-top: 20px;
  text-align: end;
}
</style>
